<template>
  <div class="asideBarItem_content" v-if="router.meta.isShow">
    <!-- 如果hasOwnProperty监测有children 就循环递归展示 -->
    <el-submenu :index="router.path" v-if="router.children && !router.meta.hiddenMenu">
      <span slot="title">{{ router.meta.title }}</span>

      <!-- 递归有子孙导航组件 -->
      <asideBarItem
        v-for="child in router.children"
        :key="child.path"
        :router="child"
      >
      </asideBarItem>
    </el-submenu>

    <!-- 无子孙导航 -->
    <el-menu-item
      :key="router.path"
      :index="router.path"
      v-if="!router.children && !router.meta.hiddenMenu"
    >
      {{ router.meta.title }}
    </el-menu-item>
  </div>
</template>

<script>
export default {
  name: 'asideBarItem',
  props: ['router']
}
</script>
